<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<script src="js/jquery.min.js"></script>
		<script src="js/bootstrap.min.js"></script>
	</head>
	<body>
		<!--
		规则配置
			require:该元素必须填写
			amount:该元素必须是金额
			integer:该元素必须是整数
			email:该元素必须为邮箱格式
			mobile:该元素必须为手机格式  1311111111
			phone:该元素必须为电话格式  010-9999990
			url:该元素必须为合法的url
			gather-than:该元素必须大于xxx
			less-than:该元素必须小于xxx
			min-length:
			max-length:
			
			.....不可预知的规则
			
		规则扩展
			bank-card:银行卡号
			card-id:身份证
		-->
		<form>
		  <div class="form-group">
		    <label for="exampleInputEmail1">Email address</label>
		    <input type="email" id="abc" class="form-control" id="exampleInputEmail1" placeholder="请输入手机号" data-bv-require="true"  data-bv-mobile="true" data-bv-regex="\w+" 
		    	 >
		  </div>
		  <div class="form-group">
		    <label for="exampleInputPassword1">Password</label>
		    <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password">
		  </div>
		  <button type="submit" class="btn btn-default">Submit</button>
		</form>
	</body>
	
	<script>
		$(function(){
			$("#abc").bootstrapValidator();//开启表单校验
		})
		console.log($("#abc").data())
	</script>
</html>
